Nota : mi código ya se está ejecutando y representando el sprite
solo un clic para jugar
Estoy aprendiendo un ejemplo de cargador Phaser3
aquí está el código que escribí
class BootScene extends Phaser.Scene { constructor() { super(); } preload() { this.load.path = 'https://raw.githubusercontent.com/liyi93319/phaser3_rpg/main/part1/assets/'; this.load.atlas('player', 'knight_atlas.png', 'knight_atlas.json'); } create() { var player = this.add.sprite(80, 100, 'player', 0); player.setScale(.5); } } var config = { width: 400, height: 300, pixelArt: true, physics: { default: 'arcade', arcade: { gravity: { y: 0 }, } }, backgroundColor: 0x000000, scene: [BootScene] } var game = new Phaser.Game(config); <script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"></script>Todo funciona bien hasta ahora.
Sin embargo, cambiando el create() de la siguiente manera
create() { var player = this.add.sprite(80, 100, 'player', 5); player.setScale(.5); }no carga el marco como se esperaba y lanza una advertencia
Falta textura.marco: 5
Comparé el archivo 'knight_atlas.json' con el del ejemplo oficial. No veo la diferencia.
También revisé el documento pero no encontré una solución.
¿Qué me estoy perdiendo?
Si desea utilizar el tercer parámetro, deberá utilizar la cadena (u objeto de textura), en este caso, el nombre de filename del atlas debería funcionar. Aquí la documentación relevante
class BootScene extends Phaser.Scene { constructor() { super(); } preload() { this.load.path = 'https://raw.githubusercontent.com/liyi93319/phaser3_rpg/main/part1/assets/'; this.load.atlas('player', 'knight_atlas.png', 'knight_atlas.json'); } create() { var player = this.add.sprite(80, 100, 'player', 'Attack (3).png'); player.setScale(.5); var player2 = this.add.sprite(240, 100, 'player', 'Idle10'); player2.setScale(.5); } } var config = { width: 400, height: 300, pixelArt: true, physics: { default: 'arcade', arcade: { gravity: { y: 0 }, } }, backgroundColor: 0x000000, scene: [BootScene] } var game = new Phaser.Game(config); <script src="https://cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"></script>